import ChildA from "./components/ChildA";
import React, { Component } from 'react';

class App extends Component {
  state = { num:5 } 
  // 定义一个修改num的方法
  setNum=v=>this.setState({num:v})
  render() { 
    return (<div>
      <h2>组件传参</h2>
      <p>App的num值：{this.state.num}</p>
      {/* react 父传子用props */}
      {/* 把函数当做props传递给子组件 */}
      <ChildA
      setNum={this.setNum} 
      value={this.state.num}></ChildA>
      <ChildA></ChildA>
      </div>);
  }
}
 
 

export default App;

// 爷父孙  爷孙传参 用 context
// 一个简单的React Context传参案例可以是这样：

// //Context 对象
// const MyContext = React.createContext();

// //父组件
// class Parent extends React.Component{
//   state = {
//     message: "Hello World"
//   }
//   render(){
//     //把状态传递给Context对象 
//     return 
//      <MyContext.Provider value={this.state.message}>
//        <Child />
//      </MyContext.Provider>
//   }
// }

// //子组件
// class Child extends React.Component{
//   render(){
//     //从Context对象中获取参数 
//     return 
//       <MyContext.Consumer>
//         {message => <p>{message}</p>}
//       </MyContext.Consumer>
//   }
// }